<!DOCTYPE html>
<style>
  div#a { --foo: purple }
  div#b { --foo: blue }
  p { background-color: var(--foo) }
</style>
<div id="a"><p>This should be purple.</p></div>
<div id="b"><p>This should be blue.</p></div>
